<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>输出语句</title>
    <script>
      /* 
        alert警告弹出框
        特点: 页面运行到alert时,会弹出警告框并且提示文字,此时页面会发生'阻塞',
        当点击确定按钮后,会打破阻塞,代码继续向下运行

        注意: 
        1.弹出的内容必须使用''或者""修饰,首选'',但是纯数字类型除外
        2.当弹出内容中本身就有'或者"时,可以使用另一个代替,即嵌套使用时,要交替

        使用场景:
        实际开发中,几乎不会使用到,因为警告框会使用第三方框架中更加漂亮优雅的组件,
        但是我们在开发或者学习时,可以使用alert()来作为一种验证和debug测试手段.
      */
      /* alert('警告弹出框')
      alert('老师说:"好好学习!"')
      alert("老师说:'好好学习!'")
      alert(1024) */

      /* 
        console.log控制台输出
        特点: 后台运行,无声无息,运行时不会阻塞代码
      */
      console.log('控制台运行...')

      //其他几种控制台输出
      console.warn('控制台运行警告...')
      console.error('控制台运行错误...')

      /* 
        prompt接收用户输入并且保存程序中,供后续使用
        注意: 实际开发中也是很少使用,主要还是在学习和测试阶段使用!
      */
      /* let age = prompt('请输入您今年的年龄:')
      alert('明年您的年龄是: ' + (age - 0 + 1)) */

      /* 
        页面输出打印
        注意: 此方式是使用JS来输出,它是动态的,而直接写在body中的代码是固定的!
      */
      let now = new Date()
      let hour = now.getHours()
      document.write('<b style="color:red">' + (hour < 12 ? '上午好!' : '下午好!') + '</b>')
    </script>
  </head>
  <body>
    <!-- <b style="color: red">上午好!</b> -->
  </body>
</html>
